<template>
   <div style="padding-top:10px;padding-bottom:40px;min-width:1000px">
      <div class="homeheader">
          <span class="cernter-title">GREE 授权项目数据看板</span>
          <span class="time">{{gettime()}}</span>
      </div>
      <main>
           <!-- 左边图表 -->
           <Left style="width:50%;padding-right:17px" ref="left"></Left>
           <!-- 右边图表 -->
           <Right style="width:50%;padding-left:17px" ref='right'></Right>
      </main>
  </div>
</template>

<script>
import Right from '../components/right.vue'
import Left from '../components/left.vue'
export default {
 data(){
    return{
    }
  },
  created(){
    //获取当前时间
    this.gettime()
  },
   mounted() {
   window.onresize = ()=>{
            this.$refs.left.onEecharts().resize();
            this.$refs.left.towEecharts().resize();
            this.$refs.right.onEecharts().resize()
            this.$refs.right.twoEcharts().resize()
            this.$refs.right.ThreeEecharts().resize()
            this.$refs.right.yuanEcharts().resize()
        }
  },
  methods:{
    gettime(){
       let time = new Date()
       let n = time.getFullYear()
       let y = time.getMonth() + 1
       let r = time.getDate()
       let xq = time.getDay()
       y < 10 ? y = "0" +  y : y
       r < 10 ? r =  "0" + r : r
       if(xq == 0){
         xq = "星期天"
       }
       if(xq== 1){
         xq = "星期一"
       }
       if(xq == 2){
         xq = "星期二"
       }
       if(xq == 3){
         xq = "星期三"
       }
       if(xq == 4){
         xq = "星期四"
       }
       if(xq== 5){
         xq = "星期五"
       }
       if(xq== 6){
         xq = "星期六"
       }
       return `${n}-${y}-${r}     ${xq}`
    }
  },
  components:{
    Right,
    Left
  }
}
</script>

<style scoped lang="less">

.homeheader{
  height: 72px;
  width: 100%;
  background-image: url("../assets/img/top.png");
  background-size: 100% 100%;
  position: relative;
  text-align: center;
  .cernter-title{
    font-size:30px;
    font-family:FZZZHUNHJW--GB1-0,FZZZHUNHJW--GB1;
    font-weight:normal;
    color:rgba(160,245,255,1);
  }
  .time{
    font-size:16px;
    font-family:PingFangSC-Regular,PingFang SC;
    font-weight:400;
    color:rgba(255,255,255,1);
    position: absolute;
    right: 14%
  }
}

main{
  padding-left: 24px;
  padding-right: 19px;
  display: flex;
  justify-content: space-between;

  .right{
    width: 50%;
  }
}
</style>
